<template>
	<view>
		<view style="display: flex;align-items: center;justify-content: center;">
			<text style="margin-left: 10upx;">
				我已同意
			</text>
			<uv-checkbox-group v-model="lookDoc" placement="row">
				<uv-checkbox :customStyle="{margin: '8px'}" label="" name="01" active-color="#f08505" >
					<view style="display: flex;">
						<text class="link" @click.stop="showDoc('doc1')">
							《用户协议》
						</text>
						<text>和</text>
						<text class="link" @click.stop="showDoc('doc2')">
							《隐私指引》
						</text>
					</view>
				</uv-checkbox>
			</uv-checkbox-group>
		</view>
		<uv-popup ref="doc1" mode="bottom" custom-style="height: 800rpx;" round="20" >
			<scroll-view class="content" scroll-y="true" >
				<view v-html="docConfig.doc1"  :style="{ paddingBottom: tabBarH + 'px'}">
					
				</view>
			</scroll-view>
		</uv-popup>
		<uv-popup ref="doc2" mode="bottom" custom-style="height: 800rpx;" round="20" >
			<scroll-view class="content" scroll-y="true" >
				<view v-html="docConfig.doc2" :style="{ paddingBottom: tabBarH + 'px'}">
					
				</view>
			</scroll-view>
		</uv-popup>
	</view>
</template>

<script>
	import docConfig from './config.js'
	console.log(docConfig, 1)
	export default {
		name:"lookDoc",
		data() {
			return {
				tabBarH: 50,
				docConfig,
				lookDoc: false
			};
		},
		watch: {
			lookDoc(value) {
				this.$emit('input', value)
			}
		},
		mounted() {
			
			this.tabBarH = uni.getStorageSync('tabBarH')
		},
		methods: {
			showDoc(refkey) {
				this.$refs[refkey].open()
			}
		}
	}
</script>

<style scoped>
.content {
			padding: 10upx;
			height: 800upx;
			box-sizing: border-box;
			overflow: auto;
		}
</style>